<template>
  <div class="user-container" >
    <back title="安全设置" />
    <ul class="group-links" >
      <li>
        <router-link to="/password" class="arrow" >
          修改登录密码
        </router-link>
      </li>
      <li>
        <router-link to="/capital" class="arrow" >
          设置资金密码
        </router-link>
      </li>
      <li>
        <router-link to="aaa" class="arrow" >
          绑定手机号
        </router-link>
      </li>
      <li>
        <router-link to="/bank" class="arrow" >
          绑定银行卡
        </router-link>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Safe"
}
</script>

<style lang="scss" scoped>
.user-container {
  padding: 0 30px;
  .group-links {
    li {
      position: relative;
      cursor: pointer;
      border-bottom: 1px solid rgba(255,255,255,.3);
      line-height: 64px;
      .icon {
        width: 30px;
        height: 30px;
        background-color: #fff;
        margin: 0 16px -10px 32px;
      }
      a {
        display: block;
        color: rgba(255,255,255,.3);
        font-size: 15px;
      }
      .arrow:before {
        position: absolute;
        right: 30px;
        top: 50%;
        margin-top: -5px;
        content: "";
        width: 10px;
        height: 10px;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
        @include webkit(box-sizing,border-box);
        @include webkit(transform, rotate(45deg));
        opacity: .2;
      }
    }
  }
}
</style>